<template>
  <div class="detail">
    <h2 class="title">{{ tableData.daChName }}</h2>
    <a-descriptions title="基本信息">
      <a-descriptions-item :span="3">
        <template #label>
          <span>
            <span style="color: #fc5531"> *</span>
            中文名称
          </span>
        </template>
        {{ tableData.daChName }}
      </a-descriptions-item>
      <a-descriptions-item :span="3">
        <template #label>
          <span>
            <span style="color: #fc5531"> *</span>
            英文名称
          </span>
        </template>
        {{ tableData.daEnName }}
      </a-descriptions-item>
      <!-- <a-descriptions-item label="中文名称" :span="3">企业基本信息表</a-descriptions-item> -->
      <!-- <a-descriptions-item label="英文名称" :span="3">CommercialReginfo</a-descriptions-item> -->
      <a-descriptions-item label="数据资产表描述" :span="3">{{ tableData.daDescribe }}</a-descriptions-item>
      <a-descriptions-item :span="3">
        <template #label>
          <span>
            <span style="color: #fc5531"> *</span>
            所属目录
          </span>
        </template>
        <a-button v-for="(item, index) in tableData.directoryNameList" :key="index" shape="round" disabled size="small" style="margin-left: 8px">{{ item }}</a-button>
      </a-descriptions-item>
      <!-- <a-descriptions-item label="所属目录" :span="3">
        <a-button shape="round" disabled size="small">企业信息/企业工商信息</a-button>
      </a-descriptions-item> -->
    </a-descriptions>
    <h3>字段信息</h3>
    <a-table :columns="columns" :data-source="tableData.daFieldDTO" bordered :pagination="false"> </a-table>
  </div>
</template>

<script lang="ts" setup>
  import { getDataAssetDetailHooks } from '@/hooks/DataAssetManagementHooks/getDataAssetDetailHooks';

  // //表格
  const columns = [
    {
      title: '字段英文名称',
      dataIndex: 'dafEnName',
      width: '10%',
    },
    {
      title: '字段中文名称',
      dataIndex: 'dafChName',
      width: '10%',
    },
    {
      title: '字段说明',
      dataIndex: 'dafExplain',
      width: '10%',
    },
    {
      title: '标准映射',
      dataIndex: 'dcCode',
      width: '10%',
    },
    {
      title: '数据类型',
      dataIndex: 'dcDataType',
      width: '10%',
    },
    {
      title: '数据长度',
      dataIndex: 'dcDataLength',
      width: '10%',
    },
    {
      title: '数据精度',
      dataIndex: 'dcDataPrecision',
      width: '10%',
    },
    {
      title: '默认值',
      dataIndex: 'dcValue',
      width: '10%',
    },
    {
      title: '取值范围',
      dataIndex: 'dcvalueRange',
      width: '10%',
    },
    {
      title: '枚举范围',
      dataIndex: 'stopwatchName',
      width: '10%',
    },
  ];
  const { tableData } = getDataAssetDetailHooks();
</script>
<style lang="less" scoped>
  :deep(.ant-descriptions-view) {
    margin-left: 5%;
  }

  .detail {
    padding: 2%;

    .title {
      text-align: center;
    }
  }

  :deep(.ant-table-cell) {
    text-align: center;
  }
</style>
